<template>
  <div>
    <van-grid :column-num="5">
      <van-grid-item
        v-for="item in navList"
        :key="item.navid"
        :icon="item.imgurl"
        :text="item.title"
      />
    </van-grid>
  </div>
</template>

<script>
import {getGridF} from "../../api/home";
import Vue from "vue";
import { Grid, GridItem } from "vant";
Vue.use(Grid);
Vue.use(GridItem);
export default {
  data() {
    return {
      navList: [],
    };
  },
  created() {
    //获取mock里的数据
   getGridF().then((data) => {
      console.log(data);
      this.navList = data.data;
    });
    //添加mock里的数据
    // myAxios.post("/navList",{id:5,imgurl:""}).then(() => {
    //   console.log("添加成功");
    // });
    //修改数据（打补丁，找到局部改变的位置进行更改）
    //  myAxios.patch("/navList/1",{"navid":12}).then(() => {
    //   console.log("修改数据成功");
    // });
    // 修改数据，覆盖修改
    //  myAxios.put("/navList/1",{title:12}).then(() => {
    //   console.log("修改数据成功");
    // });
    //删除数据
    // myAxios.delete("/navList/5").then(() => {
    //   console.log("删除成功");
    // });
  },
};
</script>

<style>
</style>